<!DOCTYPE html>
<html lang="en">
<head>


    <meta charset="UTF-8">
    <title>scenic 3d test</title>


    <link rel="shortcut icon" type="image/png" href="../../jasmine-standalone.4.21/lib/jasmine-2.4.1/jasmine_favicon.png">
    <link rel="stylesheet" href="../../jasmine-standalone.4.21/lib/jasmine-2.4.1/jasmine.css">
    <script src="../../jasmine-standalone.4.21/lib/jasmine-2.4.1/jasmine.js"></script>
    <script src="../../jasmine-standalone.4.21/lib/jasmine-2.4.1/jasmine-html.js"></script>
    <script src="../../jasmine-standalone.4.21/lib/jasmine-2.4.1/boot.js"></script>


    <link rel="stylesheet" href="../../jquerylib/jquery-ui.css">
    <script src="../../jquerylib/external/jquery/jquery.js"></script>
    <script src="../../jquerylib/jquery-ui.js"></script>
    
    <script src="../../gslib/three_compress.js"></script>
    <script src="../../gslib/gsthree.js"></script>
    <script src="../../build/gsresource.js"></script>




    <script src="../../gslib/goodstyle_treeview.js"></script>
    <link rel="stylesheet" href="../../gslib/jquery.treeview.css">

    <script src="../../business/index_business.js"></script>
    <script src="../../widget/widget.js"></script>



    <script src="test_space.js"></script>

</head>
<body >


<div id="main_test" style="position: absolute  ;width: 79% ; left: 15%; height: 100% ; display: none" >
    <div id="main_test_title" style="width: 100%;background-color: #ad37bb; "> <span style="font-size: large">3D开发区域</span></div>
    <div id="resource"  style="width: 20% ;overflow: scroll; ; height: 95% ;float: left;background-color: #00bb00 "></div>
    <div id="container" style="width : 80%; height: 95%; display: inline-block ; margin-left: 0px; position: absolute;">
        <canvas id="rd_three"  style="width: 100%; height: 100% ;"></canvas>
    </div>
</div>

<script>
    (function main() {
        function getNumber(pxValue) {
            if (pxValue) {
                return parseInt(pxValue.slice(0, pxValue.length - 2));
            }
        }

        var startX, startY, currentLeft, currentTop;
        var showElement = document.getElementById("main_test");

        document.getElementById("main_test_title").addEventListener("mousemove",function (event) {

            if (event.shiftKey) {
                if (startX == undefined) {
                    startX = event.clientX;
                }
                if (startY == undefined) {
                    startY = event.clientY;
                }
                var offsetX = event.clientX - startX;
                var offsetY = event.clientY - startY;
                showElement.style.left = currentLeft + offsetX + "px";
                showElement.style.top = currentTop + offsetY + "px";
            } else {
                currentLeft = getNumber(showElement.style.left);
                currentTop = getNumber(showElement.style.top);
                startX = startY = undefined;
            }
            showElement.boundingClientRect = undefined;

        })

    })();
</script>

</body>


</html>

